<!DOCTYPE html>
<html>
<head>
    <title>扫码量方界面</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 引入 Bootstrap -->
    <!--<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">-->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">
    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/popper.js/1.12.9/umd/popper.min.js"></script>

    <!-- HTML5 Shiv 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
    <!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <![endif]-->
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="row clearfix">
                <div class="col-md-12 column text-center">
                    <h3>
                        WCS扫码量方界面
                    </h3>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="row clearfix">
                <ul id="myTab" class="nav nav-tabs">
                    <li class="active">
                        <a data-toggle="tab">
                            工具
                        </a>
                    </li>
                    <li class="dropdown">
                        <a href="#" id="myTabDrop1" class="dropdown-toggle"
                           data-toggle="dropdown">
                            切换机器
                            <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
                            <li class="gw_robot_id" data-value="00C94707275"><a  selected="1" href="#jmeter" tabindex="-1" data-toggle="tab" >poshy1</a></li>
                            <li class="gw_robot_id" data-value="00C66186367"><a  href="#ejb" tabindex="-1" data-toggle="tab" >poshy2</a></li>
                            <li class="gw_robot_id" data-value="00C66186389"><a  href="#ejb" tabindex="-1" data-toggle="tab" >poshy3</a></li>
                            <li class="gw_robot_id" data-value="00C94707265"><a  href="#ejb" tabindex="-1" data-toggle="tab" >poshy4</a></li>
                            <li class="gw_robot_id" data-value="00C94707266"><a  href="#ejb" tabindex="-1" data-toggle="tab" >poshy5</a></li>
                        </ul>
                    </li>
                </ul>
                <div id="myTabContent" class="tab-content">
                </div>

            </div>
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active">
                            货主
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading" id="cname">
                            </h1>
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 column">
                    <div class="list-group-item active">
                        重量
                    </div>
                    <div class="list-group-item"></div>
                    <div class="list-group-item">
                        <h1 class="list-group-item-heading" id="weight">
                        </h1>
                        <p class="list-group-item-text">
                        </p>
                    </div>
                    <div class="list-group-item"></div>
                    <div class="list-group-item active">
                    </div>
                </div>
            </div>
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active">
                            发货单号
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading" id="sendcode">
                            </h1>
                            <p class="list-group-item-text">
                            </p>
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active">
                            体积
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading">
                                ***m³
                            </h1>
                            <p class="list-group-item-text">

                            </p>
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>
            </div>
            <div class="row clearfix">
                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active">
                            承运商
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading" id="expresscode">

                            </h1>
                            <p class="list-group-item-text">
                            </p>
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>
                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active" >
                            操作时间
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading">
                                <span class="" id="operation_time"></span>
                            </h1>

                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>

                <div class="col-md-6 column">
                    <div class="list-group">
                        <div class="list-group-item active">
                            当前机器
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item">
                            <h1 class="list-group-item-heading" id="currRobot">

                            </h1>
                            <p class="list-group-item-text">

                            </p>
                        </div>
                        <div class="list-group-item"></div>
                        <div class="list-group-item active">
                        </div>
                    </div>
                </div>
            </div>

            </div>

    </div>
</div>
<!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
<!--<script src="https://code.jquery.com/jquery.js"></script>-->
<!-- 包括所有已编译的插件 -->
<!--<script src="js/bootstrap.min.js"></script>-->

<div class="modal fade bd-example-modal-sm"  id="myModal" role="dialog" data-backdrop="false"  aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <p class="text-center mb-0">
                <i class="fa fa-check-circle text-success mr-1" aria-hidden="true"></i>
                暂无数据
            </p>
        </div>
    </div>
</div>

</body>
</html>

<!--订单声音提示-->
<script>
// var playSound = function () {
//     var borswer = window.navigator.userAgent.toLowerCase();
//     if ( borswer.indexOf( "ie" ) >= 0 )
//     {
//         //IE内核浏览器
//         var strEmbed = '<embed name="embedPlay" src="../../static/bling.mp3" autostart="true" hidden="true" loop="false"></embed>';
//         if ( $( "body" ).find( "embed" ).length <= 0 )
//             $( "body" ).append( strEmbed );
//         var embed = document.embedPlay;
//
//         //浏览器不支持 audion，则使用 embed 播放
//         embed.volume = 100;
//     } else
//     {
//         //非IE内核浏览器
//         var strAudio = "<audio id='audioPlay' src='/admin/images/30.wav' hidden='true'>";
//
//         if($("#audioPlay").length<=0){
//             $( "body" ).append( strAudio );
//         }
//
//         var audio = document.getElementById( "audioPlay" );
//
//         //浏览器支持 audio
//         audio.play();
//     }
// }
</script>


<script>
    var gwId = null;
    var gwRobotId = "";
    var robotSelectedId  = "" ; //是否有数据,用来提示是否已经提示过
    var hasRequested = ""; //s
    var noticeAudio = "http://att.chinauui.com/month_0701/TVNOusPT0c7zw==_ar2KDR70GtHB.mp3";
    var audio = new Audio(noticeAudio);
    // var wcsDomain = "http://47.100.250.212";
    var wcsDomain = "http://localhost";

    function book(){
        $('#myModal').modal('show');
        setTimeout(function(){
            $("#myModal").modal("hide")
        },1200);
    }
    

    var getLastGoodsweight = function () {
        gwRobotId = $("li.gw_robot_id.active").attr("data-value");
        var uri = "/robot/last_goodsweight?gwid="+gwId +"&gwRobotId="+gwRobotId;
        if(gwRobotId == "" || gwRobotId == null){
            book();
            clearInterval(interval);
        }

        $.ajax({
            url: wcsDomain + uri,
            type:'get',
            dataType : "jsonp",
            cache:"false",
            success: function (res) {

                // console.log(JSON.stringify(res.data))
                var data = res.data;

                if(data == null || data == undefined){ //判断是否已经切换过机器 阻止弹层重复弹出
                    if(hasRequested != gwId || robotSelectedId != gwRobotId){
                        book();
                    }
                    hasRequested = gwId;
                    robotSelectedId = gwRobotId;
                    return;
                }
                hasData = true;
                var resid = data.gw.id;
                var robotinfo = data.robotInfo;
                if(resid != gwId){

                    audio.play(); //播放
                    $("#cname").html(data.gw.customer);
                    $("#weight").html(data.gw.weight+"KG");
                    $("#sendcode").html(data.gw.palletid);
                    $("#expresscode").html(data.gw.carrierId);
                    $("#operation_time").html(data.gw.createTime);
                    $("#currRobot").html(robotinfo.code);
                    gwId = resid;
                }
            },
            error:function (data) {
                console.log(JSON.stringify(res.data))

            }
        });
    }

    let interval = setInterval("getLastGoodsweight()",500);

    $(".gw_robot_id").click(function () {
        setInterval("getLastGoodsweight()",500);
    })
</script>
